@charset "UTF-8";
.base{box-sizing: border-box;}

.button{composes: base;border: none;text-align: center;outline: none;font-family: Avenir;font-weight: 600;vertical-align: middle;}

.sizeNormal{height: 50px;min-width: 160px;padding: 0 30px;line-height: 50px;border-radius: 25px;}
.sizeSmall{height: 35px;line-height: 35px;min-width: 90px;padding: 0 25px;border-radius: 17.5px;}
.color{color: #fff;font-size: 13px;}
.colorGreen{composes: color;background-color: #1abcb0;}
.colorGreen:hover{background-color: #16a096;box-shadow: 0 2px 5px #888;}
.colorPurple{composes: color;background-color: #756ed5;}
.colorPurple:hover{background-color: #645ebe;box-shadow: 0 2px 5px #888;}
.colorBlue{composes: color;background-color: #28b5f2;}
.colorBlue:hover{background-color: #1f9dd3;box-shadow: 0 2px 5px #888;}
.colorRed{composes: color;background-color: #e10098;}
.colorRed:hover{background-color: #c00082;box-shadow: 0 2px 5px #888;}
.disabled{composes: color;background-color: #d8e1e5; color: #9bafba;cursor: not-allowed;}
.disabled:hover{background-color: #d8e1e5; color: #9bafba;cursor: not-allowed;box-shadow: none;}
.colorWhite{color: #16a096;background: #fff;box-shadow: 0 2px 5px #ddd;}
.colorWhite:hover{color: #16a096;background: #fff;box-shadow: 0 5px 20px #ddd;}
